<template>
	<view class="page_box">
		<u-navbar :is-back="false" title="活动 " v-if="1" :border-bottom="false"></u-navbar>

		<view class="content_box">
			<view class="">
				<z-paging
				use-page-scroll
					ref="paging"
					v-model="dataList"
					@query="hm"
					:default-page-size="5"
					loading-more-no-more-text="我也是有底线的！"
					:use-page-scroll="true"
					:show-refresher-update-time="true"
					:refresher-update-time-key="3"
				>
					<custom-refresher slot="refresher" slot-scope="{ refresherStatus }" :status="refresherStatus"></custom-refresher>
					<view class=" padding-lr padding-top-xs">
						<!-- <view class="padding-lr padding-tb flex align-center">
							<image src="../../static/re.png" mode="" class="w36 h36"></image>
							<text class="f32 text-bold text-black ml13">热门活动</text>
						</view> -->
						<block v-for="(item, index) in dataList" :key="index">
							<view class="ww100 h342 bg-white u-relative" @click="l.to('/pages/index/evntDetails?id=' + item.id)">
								<u-lazy-load
									:image="item.image_url"
									mode="aspectFill"
									class="ww100 h342"
									imgMode="aspectFill"
									height="342"
								></u-lazy-load>
								<image
									src="../../static/mianfei.png"
									mode="aspectFill"
									class="w100 h50 bgimg"
									v-if="item.discount_price == '0.00'"
								></image>
							</view>
							<view class="mt28">
								<text class="f28 text-bold">{{ item.title }}</text>
							</view>
							<view class="flex justify-between align-center mt13 mb13">
								<view class="flex align-center ">
									<image src="../../static/time.png" mode="" class="w26 h26"></image>
									<text class="f26 text-gray ml10 block " style="width: 70vw; overflow: scroll; white-space: nowrap;">
										活动时间：{{ item.show_time }}
									</text>
								</view>
								<view class="padding-tb-xs padding-lr-sm round bolck" style="background-color: #fff2f1">
									<text class="f24" style="color: #f2736d">{{ item.status }}</text>
								</view>
							</view>
							<!-- 0 未审核
							<view class="mt28 flex align-center mb40" v-if="item.activity_list_status==0">
							   <image src="../../static/12162.png" mode="aspectFill" class="w26 h26"></image>
							   <text class="f26  ml10" style="color: #FB8681;">您的路演申请正在审核中...</text>
							</view>
							
							1 审核通过
							<view class="mt28 flex align-center mb40" v-if="item.activity_list_status == 1">
								<image src="../../static/dui.png" mode="aspectFill" class="w26 h26"></image>
								<text class="f26 text-green ml10">您的路演申请通过，请按时与会</text>
							</view>
							2 审核未通过
							<view class="mt28 flex align-center mb40" v-if="item.activity_list_status == 2">
								<image src="../../static/12161.png" mode="aspectFill" class="w26 h26"></image>
								<text class="f26  ml10" style="color: #FB8681;">您的路演审核未通过，请下次提前预约</text>
							</view>
							3已报名
							
							<view class="mt28 flex align-center mb40" v-if="item.activity_list_status == 3">
								<image src="../../static/dui.png" mode="aspectFill" class="w26 h26"></image>
								<text class="f26 text-green ml10">您已报名,请按时与会</text>
							</view>
							4未报名
							<view class="mt28 flex align-center mb40" v-if="item.activity_list_status == 4">
								<image src="../../static/12161.png" mode="aspectFill" class="w26 h26"></image>
								<text class="f26  ml10" style="color: #FB8681;">活动未报名，请下次提前预约</text>
							</view>
							5 未登录
							<view class="mt28 flex align-center mb40" v-if="item.activity_list_status == 5">
								<image src="../../static/dui.png" mode="aspectFill" class="w26 h26"></image>
								<text class="f26 text-green ml10">活动可报名申请</text>
							</view> -->
						</block>
					</view>
				</z-paging>
			</view>
		</view>

		<yy-login v-if="vuex_login"></yy-login>
		<yy-loading text="加载中.." mask="true" click="true" ref="loading"></yy-loading>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
export default {
	data() {
		return {
			//615
			windowHeight: this.windowHeight,

			page: 1,
			page_size: 10,
			dataList: [],
		};
	},
	onShow() {},
	onLoad(e) {},
	methods: {
		// async hm() {
		// 	let obj = {
		// 		page: this.page,
		// 		page_size: this.page_size
		// 	};
		// 	const res = await this.$u.post('index/index', obj, {});
		// 	this.data = res.data;
		// }
		async hm(pageNo, pageSize) {
			let obj = {
				page: pageNo,
				page_size: pageSize,
			};
			const res = await this.$u.post('index/index', obj, {});
			if (res.code) {
				if (Object.keys(res.data.list).length == 0) {
					return this.$refs.paging.complete([]);
				}
				this.$refs.paging.complete(res.data.list);
			}
		},
	},
};
</script>

<style lang="scss" scoped>
.u-mask {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(127, 127, 127, 0.5);
	transition: transform 0.3s;
	z-index: 15;

	.rect {
		width: 520rpx;
		height: 620rpx;
		background-image: url(https://sprtcar.oss-cn-chengdu.aliyuncs.com/home/20210617144543.png);
	}
}
.page_box {
	height: 100%;
}
.content_box {
	height: 100%;
	.bgimg {
		position: absolute;
		top: 0;
		left: 0;
		// transform: translateX(-50%);
	}
	.bgimg1 {
		background-image: url(https://sprtcar.oss-cn-chengdu.aliyuncs.com/home/20210616111828.png);
	}
	.bgimg2 {
		background-image: url(https://sprtcar.oss-cn-chengdu.aliyuncs.com/home/20210616111932.png);
	}
}
</style>
